<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>懒加载</title>
		<style type="text/css">
			*{
				padding: 0;
				margin: 0;
			}
			div{
				height: 1400px;
			
			}
			/*img{
				width: 100%;
			}*/
		</style>
	</head>
	<body>

		<div><img data-original="../../image/gamersky_08origin_15_201892517282A5.jpg" alt="" /></div>
		<div><img data-original="../../image/gamersky_04origin_07_20178262058999.jpg" alt="" /></div>
		<div><img data-original="../../image/gamersky_02origin_03_20174222045714.jpg" alt="" /></div>
		<div><img data-original="../../image/gamersky_02origin_03_2018911618A7E.jpg" alt="" /></div>
		<script src="jquery-2.1.0.js" type="text/javascript" charset="utf-8"></script>
		<script src="jquery.lazyload.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			//懒加载   看到哪里  记载到哪里
			
			$("img").lazyload({
				//提前量  例如 滚动时，提前200px就可以进行加载
				threshold:200,
				effect:"fadeIn",
				
				//效果时间
				effectspeed:1000,
				
				//占位图
				placeholder:"../../image/loading.gif",
				
				
				//触发事件
				//event:"click"
			})
		</script>
	</body>
</html>
